<template>
  <div>
    <div class="sui-container wrapper">
    <!--头部导航-->
    <header>
      <div class="sui-navbar">
        <div class="navbar-inner">
          <a href="~/assets/headline-login.html" class="sui-brand"><img src="~/assets/img/asset-logo-black.png" alt="社交" /></a>
          <ul class="sui-nav">
            <!--<li class="active"><a href="~/assets/headline-logined.html">头条</a></li>-->
            <li>
              <router-link to="/" >头条</router-link>
            </li>
            <li><a href="~/assets/qa-login.html">问答</a></li>
            <!--<li><a href="~/assets/activity-index.html">活动</a></li>-->

            <li>
              <router-link to="/activity" >活动</router-link>
            </li>
            <li><a href="~/assets/makeFriends-index.html">交友</a></li>
            <li><a href="~/assets/spit-index.html">吐槽</a></li>
            <li><a href="~/assets/recruit-index.html">招聘</a></li>
          </ul>
          <form class="sui-form sui-form pull-left">
            <input type="text" placeholder="输入关键词..." />
            <span class="btn-search fa fa-search"></span>
          </form>
          <div class="sui-nav pull-right info" v-if="username">
            {{username}}
          </div>
          <div class="sui-nav pull-right info" v-if="!username">
            <li><a href="~/assets/person-loginsign.html" target="_blank">注册</a></li>
            <li><a :href="'/login'" target="_blank" class="sui-btn btn-login">登录</a></li>
          </div>
        </div>
      </div>
    </header>
    </div>
    <nuxt/>
    <div class="footer">
      <div class="wrapper">
        <div class="footer-bottom">
          <div class="link">
            <dl>
              <dt>
                网站相关
              </dt>
              <dd>
                关于我们
              </dd>
              <dd>
                服务条款
              </dd>
              <dd>
                帮助中心
              </dd>
              <dd>
                编辑器语法
              </dd>
            </dl>
            <dl>
              <dt>
                常用链接
              </dt>
              <dd>
                泽林
              </dd>
              <dd>
                泽林论坛
              </dd>
            </dl>
            <dl>
              <dt>
                联系我们
              </dt>
              <dd>
                联系我们
              </dd>
              <dd>
                加入我们
              </dd>
              <dd>
                建议反馈
              </dd>
            </dl>
            <dl>
              <dt>
                关注我们
              </dt>
              <dd>
                微博
              </dd>
              <dd>
                twitter
              </dd>
            </dl>
            <div class="xuke">
              <h3>内容许可</h3>
              <p>除特别说明外，用户内容均采用知识共享署名-非商业性使用-禁止演绎4.0 国际许可协议 (CC BY-NC-ND 4.0) 进行许可</p>
              <p>本站由 泽林研究院 提供更新服务</p>
            </div>
          </div>
          <p class="Copyright">Copyright &copy; 2021 泽林问答社区 当前版本 2.0</p>
        </div>
      </div>
    </div>
  </div>
</template>

<style>

</style>

<script>
  import '~/assets/plugins/normalize-css/normalize.css'
  import '~/assets/plugins/yui/cssgrids-min.css'
  import '~/assets/plugins/sui/sui.min.css'
  import '~/assets/plugins/sui/sui-append.min.css'
  import '~/assets/plugins/font-awesome/css/font-awesome.min.css'
  import '~/assets/css/widget-base.css'
  import '~/assets/css/widget-head-foot.css'
  import '~/assets/css/page-sj-headline-login.css'

  import {getUsername} from "@/api/user"
  export default {
      data(){
        return {
          username:""
        }
      },
      mounted(){
        this.getName();
      },
      methods:{
        getName(){
          getUsername().then(({data})=>{
            console.log(data);
            this.username = data.data.name;
          })
        }
      }
  }
</script>
